<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/commons/global.jsp"%>
<style>

</style>
<script type="text/javascript">
    var sqlExcelReportDataGrid;
    $(function() {
        sqlExcelReportDataGrid = $('#sqlExcelReportDataGrid').datagrid({
            url : '${path}/sqlExcelReport/dataGrid',
            striped : true,
            rownumbers : true,
            pagination : true,
            singleSelect : true,
            idField : 'id',
            sortName : 'id',
            sortOrder : 'asc',
            pageSize : 20,
            pageList : [ 10, 20, 30, 40, 50, 100, 200, 300, 400, 500 ],
            columns : [ [
                {
                width : '100',
                title : 'id',
                field : 'id'
                ,hidden : true
            },
                {
                width : '100',
                title : 'sql语句',
                field : 'sql',
                hidden:true
            }, {
                width : '200',
                title : '名称',
                field : 'name'
            },
                {
                width : '100',
                title : '类型',
                field : 'type',
                hidden:true
            },
            {
                width : '100',
                title : '类型',
                field : 'typeName'
            },
                {
                width : '100',
                title : '顺序',
                field : 'seq',
                sortable:true
            },{
                field : 'action',
                title : '操作',
                width : 400,
                formatter : function(value, row, index) {
                    var str = '';
                    str += $.formatString('<a href="javascript:void(0)" class="sqlExcelReport-easyui-linkbutton-edit" data-options="plain:true,iconCls:\'fi-pencil icon-blue\'" onclick="editSqlExcelReportFun(\'{0}\');" >编辑</a>', row.id);
                    str += '&nbsp;&nbsp;|&nbsp;&nbsp;';
                    str += $.formatString('<a href="javascript:void(0)" class="sqlExcelReport-easyui-linkbutton-design" data-options="plain:true,iconCls:\'fi-wrench icon-green\'" onclick="designSqlExcelReportFun(\'{0}\');" >设计报表</a>', row.id);
                    str += '&nbsp;&nbsp;|&nbsp;&nbsp;';
                    str += $.formatString('<a href="javascript:void(0)" class="sqlExcelReport-easyui-linkbutton-view" data-options="plain:true,iconCls:\'fi-magnifying-glass icon-green\'" onclick="viewSqlExcelReportFun(\'{0}\',\'{1}\');" >查看报表</a>', row.id,row.name);
                    str += '&nbsp;&nbsp;|&nbsp;&nbsp;';
                    str += $.formatString('<a href="javascript:void(0)" class="sqlExcelReport-easyui-linkbutton-del" data-options="plain:true,iconCls:\'fi-x icon-red\'" onclick="deleteSqlExcelReportFun(\'{0}\');" >删除</a>', row.id);
                    return str;
                }
            } 
                
            ]],
            onLoadSuccess:function(data){
                $('.sqlExcelReport-easyui-linkbutton-edit').linkbutton({text:'编辑'});
                $('.sqlExcelReport-easyui-linkbutton-design').linkbutton({text:'设计报表'});
                $('.sqlExcelReport-easyui-linkbutton-view').linkbutton({text:'查看报表'});
                $('.sqlExcelReport-easyui-linkbutton-del').linkbutton({text:'删除'});
            },
            toolbar : '#sqlExcelReportToolbar'
        });
    });

    function addSqlExcelReportFun() {
        parent.$.modalDialog({
            title : '添加',
            width : 500,
            height : 300,
            href : '${path}/sqlExcelReport/addPage',
            buttons : [ {
                text : '确定',
                handler : function() {
                    parent.$.modalDialog.openner_dataGrid = sqlExcelReportDataGrid;//因为添加成功之后，需要刷新这个treeGrid，所以先预定义好
                    var f = parent.$.modalDialog.handler.find('#sqlExcelReportAddForm');
                    f.submit();
                }
            } ]
        });
    }

    function editSqlExcelReportFun(id) {
        if (id == undefined) {
            var rows = sqlExcelReportDataGrid.datagrid('getSelections');
            id = rows[0].id;
        } else {
            sqlExcelReportDataGrid.datagrid('unselectAll').datagrid('uncheckAll');
        }
        parent.$.modalDialog({
            title : '编辑',
            width : 500,
            height : 300,
            href : '${path}/sqlExcelReport/editPage/' + id,
            buttons : [ {
                text : '确定',
                handler : function() {
                    parent.$.modalDialog.openner_dataGrid = sqlExcelReportDataGrid;//因为添加成功之后，需要刷新这个dataGrid，所以先预定义好
                    var f = parent.$.modalDialog.handler.find('#sqlExcelReportEditForm');
                    f.submit();
                }
            } ]
        });
    }

    function deleteSqlExcelReportFun(id) {
        if (id == undefined) {//点击右键菜单才会触发这个
            var rows = sqlExcelReportDataGrid.datagrid('getSelections');
            id = rows[0].id;
        } else {//点击操作里面的删除图标会触发这个
            sqlExcelReportDataGrid.datagrid('unselectAll').datagrid('uncheckAll');
        }
        parent.$.messager.confirm('询问', '您是否要删除吗？', function(b) {
            if (b) {
                progressLoad();
                $.post('${path}/sqlExcelReport/delete/'+id, {}
                , function(result) {
                    if (result.success) {
                        parent.$.messager.alert('提示', result.msg, 'info');
                        sqlExcelReportDataGrid.datagrid('reload');
                    }
                    progressClose();
                }, 'JSON');
            }
        });
    }
    function searchSqlExcelReportFun() {
    	sqlExcelReportDataGrid.datagrid('load', $.serializeObject($('#searchSqlExcelReportForm')));
    }
    function cleanSqlExcelReportFun() {
        $('#searchSqlExcelReportForm input').val('');
        $('#searchSqlExcelReportForm [name=type]').val('');
       sqlExcelReportDataGrid.datagrid('load', {});
    }
    //设置报表
    function designSqlExcelReportFun(id){
        var opts = {
        title : '设置报表',
        border : false,
        closable : true,
        fit : true,
        href:'${path}/sqlExcelQueryExpression/manager?id='+id
        };
        addTab(opts);
    }
    //查看报表
    function viewSqlExcelReportFun(id,name){
        var opts = {
        title : name+'报表',
        border : false,
        closable : true,
        fit : true,
        href:'${path}/sqlExcelReport/view?id='+id
        };
        addTab(opts);
    }
    //设置查询参数
    <%--function querySqlExcelReportFun(id,name){--%>
    	<%--var opts = {--%>
                <%--title : '设置查询参数',--%>
                <%--border : false,--%>
                <%--closable : true,--%>
                <%--fit : true,--%>
                <%--href:'${path}/sqlExcelQueryExpression/manager?id='+id+"&name="+name--%>
            <%--};--%>
        <%--addTab(opts);--%>
    <%--}--%>
   function sqlExcelReportSXFun(){
	   if($('#searchSqlExcelReportForm').css('display')=='none'){
            $('#searchSqlExcelReportForm').css('display','block');
            $('#sqlExcelReportDataGrid').height($('#sqlExcelReportDataGrid').height()-30)
        }else{
            $('#searchSqlExcelReportForm').css('display','none');
            $('#sqlExcelReportDataGrid').datagrid('resize',function(target,width){
            })
        }
         //重新设置数据表格高度
         $('#sqlExcelReportDataGrid').datagrid({fit:true});
   } 
</script>
<div class="easyui-layout" data-options="fit:true,border:false">
	<div data-options="region:'center',border:false">
		<table id="sqlExcelReportDataGrid"
			data-options="fit:true,border:false"></table>
	</div>
</div>
<div id="sqlExcelReportToolbar" style="display: none;">
	<form id="searchSqlExcelReportForm" style="width:100%;height:30px;display:none">
		<table>
			<tr>
				<td>类型</td>
				<td><select name="type" class="easyui-text">
						<option value="">请选择</option>
						<c:forEach var="type" items="${types}">
							<option value="${type.id }">${type.name }</option>
						</c:forEach>
				</select></td>

				<td>名称</td>
				<td><input name="name" type="text" placeholder="请输入名称"
					class="easyui-text  span2"></td>
				<td><a href="javascript:void(0);" class="easyui-linkbutton"
					data-options="iconCls:'fi-magnifying-glass',plain:true"
					onclick="searchSqlExcelReportFun();">查询</a> <a
					href="javascript:void(0);" class="easyui-linkbutton"
					data-options="iconCls:'fi-x-circle',plain:true"
					onclick="cleanSqlExcelReportFun();">清空</a></td>
			</tr>

		</table>
	</form>
	<a onclick="addSqlExcelReportFun();" href="javascript:void(0);"
		class="easyui-linkbutton"
		data-options="plain:true,iconCls:'fi-plus icon-green'">添加</a> <a
		onclick="sqlExcelReportSXFun();" href="javascript:void(0);"
		class="easyui-linkbutton"
		data-options="plain:true,iconCls:'fi-filter icon-green'">筛选</a>
</div>
